<template>
   <div>
      <h1>使用辅助函数访问vuex的模块</h1>
      <div>{{num}}</div>
      <button @click="add">同步+2</button>
      <button @click="addAsync">异步+3</button>
   </div>
</template>

<script>
import {createNamespacedHelpers} from 'vuex'
const {mapState:mapCounterState,mapMutations:mapCounterMutations,mapActions:mapCounterActions,mapGetters:mapCounterGetters}=createNamespacedHelpers('counterKey')
export default {
    data(){
        return{
            count:100
        }
    },
    computed:{
        ...mapCounterState({'num':'count'}),
        ...mapCounterGetters(['dobuleCount'])
    },
    methods:{
        ...mapCounterMutations(['INCREMENT_COUNT']),
        ...mapCounterActions(['incrementAsync']),
        add(){
            this.INCREMENT_COUNT(2)
        },
        addAsync(){
            this.incrementAsync(3)
        }
    }
}
</script>

<style>

</style>